import React from 'react';
import store from '../store'
import {Menu} from "antd";
import {Link} from 'react-router-dom'
// import * as icon from "@ant-design/icons";

// const items2 = ['UserOutlined', 'LaptopOutlined', 'NotificationOutlined'].map((icon, index) => {
//     const key = String(index + 1);
//     return {
//         key: `sub${key}`,
//         icon: React.createElement(icon),
//         label: `subnav ${key}`,
//         children: new Array(4).fill(null).map((_, j) => {
//             const subKey = index * 4 + j + 1;
//             return {
//                 key: subKey,
//                 label: `option${subKey}`,
//             };
//         }),
//     };
// });


function AppMenu() {
    // const  userRouter = useSelector(state=> {state})
    const  userRouter = store.getState().userStore.user.route
    // console.log('侧边栏拿到信息',userRouter)
    const items = userRouter.map((item) => {
        if(item.children && item.children.length>1){
            return {
                key: item.id,
                label: item.title,
                children:(item.children&&item.children.length>1)? item.children.map((itemC) => {
                    return {
                        key: itemC.id,
                        label: <Link to={itemC.path}>{itemC.title}</Link>,
                    };
                }):''
            };
        }else {
            return {
                key: item.id,
                label: <Link to={item.path}>{item.title}</Link>,
            };
        }

    });
    const onopenMenuChange = (keys)=>{
        console.log(keys)
    }
    // console.log(userRouter)
    return (
        <Menu
            mode="inline"
            defaultSelectedKeys={['1']}
            defaultOpenKeys={[]}
            onClick={onopenMenuChange}
            style={{
                height: '100%',
                borderRight: 0,

                width:200,
                paddingLeft:"20px",
            }}
            items={items}
        />
    );
}

export default AppMenu;